// 作者：知乎 @带只拖鞋去流浪 
import React from "react"
import * as  echarts from 'echarts';

const AutoChart = (props) => {
    const chartRef = React.useRef(null);

    const [chart, setChart] = React.useState();

    const handleResize = () => chart.resize();

    const init = () => {
       
        if (chart) {// 建议替换为 ResizeObserver （2023.5.25）
            window.removeEventListener('resize', handleResize);
            // echarts.getInstanceByDom(chartRef.current).clear();
        }

        if (chartRef.current) {
           
            const pieChart = echarts.getInstanceByDom(chartRef.current) || echarts.init(chartRef.current);
            pieChart.setOption(props.option);
            window.addEventListener('resize', handleResize);
            setChart(pieChart);
        }


    };

    React.useEffect(() => {
        init();
        return () => {
            window.removeEventListener('resize', handleResize);
        }
    }, [props.option]);

    return <div ref={chartRef} style={{ height: '100%', width: '100%' }} />;
};

export default AutoChart;


